<template>
	<uv-sticky bgColor="#f6f6f6">
		<uv-tabs :scrollable="false" lineColor="#fe536f" :activeStyle="{color: '#222',fontWeight: 'bold'}" :inactiveStyle="{
			color: '#999'}" :list="list" @click="clickChange"></uv-tabs>
	</uv-sticky>
	<view class="padding_30">
		<view v-if="currentIndex==1">
			<hr-pull-load class="scroll-view" @refresh='refresh2' @loadMore='loadMore2' :height='scrollHeight'
				:pullHeight='pullHeight' :maxHeight='50' :lowerThreshold='20' :bottomTips='bottomTips' :isAllowPull="true"
				:isTab='false' ref='hrPullLoadRef2'>
					<ReleaseActiveList :list="userApplyList" ishome="user" :isApplyList="true" @checkList="initList" type="usermaker"></ReleaseActiveList>
			</hr-pull-load>
		</view>
		<view v-if="currentIndex==0">
			<hr-pull-load class="scroll-view" @refresh='refresh' @loadMore='loadMore' :height='scrollHeight'
				:pullHeight='pullHeight' :maxHeight='50' :lowerThreshold='20' :bottomTips='bottomTips' :isAllowPull="true"
				:isTab='false' ref='hrPullLoadRef'>
					<view>
						<FriendList :list="claimTaskList" type="usermark" :isApplyList="true"></FriendList>
					</view>
			</hr-pull-load>
		</view>
	</view>

</template>

<script setup>
import {onLoad,onReachBottom,onReady} from '@dcloudio/uni-app'
import { ref,reactive,nextTick } from 'vue';
import {userClaimTaskListAPI} from '@/api/user.js'
import {useUserStore} from '@/store/modules/user.js'
const userstore = useUserStore()
import FriendList from '@/components/FriendList.vue';
import ReleaseActiveList from '@/components/ReleaseActiveList.vue';
import hrPullLoad from '@/components/hr-pull-load/hr-pull-load.vue';

	const page = ref(1)
	const loadStatus=ref('loadmore')
	const userApplyList = ref([])
	const currentIndex = ref(0)
	const list = reactive([
		{
			name: '任务申领',
		}, {
			name: '活动报名',
		}
	])
	const claimTaskList = ref([])
	const count = ref(0)
	const scrollHeight = ref(0)
	const pullHeight = ref(20)
	const hrPullLoadRef = ref()
	const hrPullLoadRef2 = ref()
	onLoad(()=>{
		getUserClaimTaskList()
	})
	onReady(() => {
		nextTick(() => {
			uni.getSystemInfo({
				success: (res) => {
					const query = uni.createSelectorQuery().select('.scroll-view')
						.boundingClientRect()
					query.exec((result) => {
						if (result && result.length) {
							scrollHeight.value = res.windowHeight - result[0].top +
								'px'
						}
					})
				}
			})
		})
	})
	// onReachBottom(()=>{
	// 	if(currentIndex.value==1){
	// 		if (userApplyList.value.length >= count.value){
	// 		  uni.showToast({
	// 		    title: "没有更多了",
	// 		    icon:"none",
	// 		    mask: true,
	// 		    duration: 800
	// 		  })
	// 		  return
	// 		}
	// 		page.value++
			
	// 		uni.showLoading({
	// 		  title: "正在加载...",
	// 		  mark: true
	// 		})
	// 		getUserApplyList()
	// 	}else{
	// 		if (claimTaskList.value.length >= count.value){
	// 		  uni.showToast({
	// 		    title: "没有更多了",
	// 		    icon:"none",
	// 		    mask: true,
	// 		    duration: 800
	// 		  })
	// 		  return
	// 		}
	// 		page.value++
			
	// 		uni.showLoading({
	// 		  title: "正在加载...",
	// 		  mark: true
	// 		})
	// 		getUserClaimTaskList()
	// 	}
	// })
	const initList=()=>{
		let obj={
			index:1,
			name:'活动报名'
		}
		clickChange(obj)
	}
	const clickChange = (e)=>{
		currentIndex.value = e.index
		if(currentIndex.value==1){
			userApplyList.value = []
			page.value = 1
			getUserApplyList()
		}else{
			claimTaskList.value = []
			page.value = 1
			getUserClaimTaskList()
		}
	}
	// 刷新任务
	const refresh = () => {
		page.value = 1
		claimTaskList.value = []
		getUserClaimTaskList()
		setTimeout(() => {
			hrPullLoadRef.value.reSet();
		}, 300);
	}
	// 更多任务
	const loadMore = () => {
		if (claimTaskList.value.length >= count.value){
		  uni.showToast({
		    title: "没有更多了",
		    icon:"none",
		    mask: true,
		    duration: 800
		  })
		  return
		}
		page.value++
		
		uni.showLoading({
		  title: "正在加载...",
		  mark: true
		})
		getUserClaimTaskList()
	}
	// 刷新活动
	const refresh2 = () => {
		userApplyList.value = []
		page.value = 1
		getUserApplyList()
		setTimeout(() => {
			hrPullLoadRef2.value.reSet();
		}, 300);
	}
	// 更多活动
	const loadMore2 = () => {
		if (userApplyList.value.length >= count.value){
		  uni.showToast({
		    title: "没有更多了",
		    icon:"none",
		    mask: true,
		    duration: 800
		  })
		  return
		}
		page.value++
		
		uni.showLoading({
		  title: "正在加载...",
		  mark: true
		})
		getUserApplyList()
	}
	// 获取活动列表
	const getUserApplyList = async()=>{
		let res = await userstore.getUserApplyList({lat:uni.getStorageSync('latitude'),lng:uni.getStorageSync('longitude'),page:page.value,user_id:userstore.userInfo.id})
		if(res.code==200&&res.data){
			uni.hideLoading()
			count.value = res.data.total
			userApplyList.value = userApplyList.value.concat(res.data.data)
		}
	}
	// 获取用户申领的任务列表
	const getUserClaimTaskList = ()=>{
		userClaimTaskListAPI({lat:uni.getStorageSync('latitude'),lng:uni.getStorageSync('longitude'),page:page.value,user_id:userstore.userInfo.id}).then(res=>{
			uni.hideLoading()
			count.value = res.data.total
			claimTaskList.value = claimTaskList.value.concat(...res.data.data)
		})
	}
</script>
<style>
	page{
		background-color: #f6f6f6;
	}
</style>
<style lang="scss" scoped>
</style>